//保存表格的实例对象
var sx = null;
//调用封装方法
getTable();


// ---------------------------------------------------
//方法区

//封装方法重载表格
function sxTable(){
    //通过表格id参数  重载刷新
    sx.reload()
}


//封装渲染表格
function getTable(){
    layui.use(['table','layer','jquery','form','laydate'],function() {
        //模板保存到变量上
        var laydate = layui.laydate;
        var table = layui.table;
        var layer = layui.layer;
        var form = layui.form;
        var $ = layui.$;

        //监听顶部刷新按钮
        form.on('submit(sx)',function (d){
            location.reload();
        })

        //鉴定顶部返回按钮
        form.on('submit(fh)',function (d){
            layer.msg('返回上一级页面')
        })


        //监听顶部搜索按钮
        form.on('submit(*)',function (d){
            console.log(d.field)
            var data = d.field;
            sx.reload({
                url:'/YltUser/UserManage/getZeroMonsyByLike',
                where:{
                    userName:data.userName,
                    userAccount:data.userAccount,
                    userCreateDate:data.userCreateDate
                }
            },true)
            return false
        })

        //监听顶部重置按钮
        form.on('submit(cz)',function (d){
            $("[name=userName]").val(undefined)
            $("[name=userAccount]").val(undefined)
            $("[name=userCreateDate]").val(undefined)

            sx.reload({
                url:'/YltUser/UserManage/getZeroMonsy',
            },true)
            return false
        })

        // 渲染input日期
        laydate.render({
            elem:'#userCreateDate'
        })

        sx = table.render({
            elem:"#demo",
            url:"/YltUser/UserManage/getZeroMonsy",
            page:{
                layout:['count','prev','page','next','limit'],
                groups:5,
                limit:10,
                limits:[5,10,20]
            },
            cols:
                [[
                    // {field: 'courseLogId', title: '序号',width: 100,align: 'center'},
                    {field: 'insider', title: '用户类型',width: 100,align: 'center',templet:function (d){
                        if(d.user.insider == '2'){
                            return '<i class="layui-icon layui-icon-group" style="font-size: 30px; color: #FF5722;"></i>  '
                        }else if(d.user.insider == '1') {
                            return '<i class="layui-icon layui-icon-group" style="font-size: 30px; color: #01AAED;"></i>  '
                        }else{
                            return '<i class="layui-icon layui-icon-group" style="font-size: 30px; color: #314644;"></i>  '
                        }
                    }},
                    {field: 'userId', title: '用户编号',width: 150,align: 'center',templet:function (d){
                            return d.user.userId;
                        }},
                    {field: 'userAccount', title: '用户账号', width:200,align: 'center',templet:function (d){
                            return d.user.userAccount;
                        }},
                    {field: 'userName', title: '用户昵称',width: 200,align: 'center',templet:function (d){
                            return d.user.userName;
                        }},
                    {field: 'learningTime', title: '学习时长', width:180,align: 'center',templet:function (d){
                            return d.learningTime + '分钟';
                        }},
                    {field: 'consumeMoney', title: '用户消费金额', width: 180, align: 'center',templet:function (d){
                            return d.consumeMoney + '￥';
                        }},
                    {field: 'userCreateDate', title: '用户注册时间', width: 200,align: 'center',templet:function (d){
                            return d.user.userCreateDate;
                        }},
                    {field: 'userStats', title: '账号状态', width: 220,align: 'center',templet:function (d){
                            if(d.user.userStats == 1){
                                return '<input type="checkbox" name="userStats" value="1" lay-skin="switch" lay-text="正常|禁用" lay-filter="d" checked="">'
                            }else {
                                return '<input type="checkbox" name="userStats" value="0" lay-skin="switch" lay-text="正常|禁用" lay-filter="d">'
                            }
                        }},
                    {title: '操作',toolbar:'#tooldemo',width: 200,align: 'center'}
                ]],
            toolbar:'#toolbardemo',
            skin: 'line',
            parseData:function (res){
                return{
                    "code":res.code,
                    "msg":res.msg,
                    "count":res.count,
                    "data":res.data
                }
            }

        }),

        // 监听table 正常/禁用
        $(document).on('click','.layui-unselect',function (obj){
            let dom = $(this);
            let html = dom.find('em').text();
            let id = dom.parents('tr').find("td[data-field = 'userId']").find('div').text();


            var value = 0;
            if (html == "正常"){
                value = 1;
            }else if (html == "禁用"){
                value = 0;
            }

            $.ajax({
                type: 'post',
                url: '/YltUser/UserManage/upUserStats',
                contentType:'application/json',
                dataType: 'json',
                data:JSON.stringify({userId:id,userStats:value}),
                success: function (res) {
                    if (res.state == '200'){
                        layer.msg('更改状态成功',{icon:6,time:1000})
                    }else {
                        layer.msg('更改状态失败',{icon:5,time:1000})
                    }
                }
            })



        });

        //监听表格头部
        table.on('toolbar(filterDemo)',function (obj){
            if (obj.event == 'zs'){
                layer.open({
                    type:2,
                    title:'勾选用户',
                    content:'zeroTable.html',
                    shade:[1,'#37444B'],
                    anim:4,
                    area:['90%','90%']
                })
            }

        }),

        //监听表格工具栏
        table.on('tool(filterDemo)',function(obj){
            var data = obj.data;
            if(obj.event == 'ck'){
                layer.open({
                    type:2,
                    title:'查看用户信息',
                    content:'ckUser.html',
                    shade:[1,'#37444B'],
                    anim:4,
                    area:['90%','90%'],
                    //弹出层成功弹出后的回调函数
                    success:function (layero,index){
                        //父页面向子页面传参 -- 向iframe层传数据
                        //获取iframe页面
                        var body = layer.getChildFrame('body',index);

                        console.log(data);
                        body.find('#userId').val(data.user.userId);
                        body.find('#userName').val(data.user.userName);
                        body.find('#userAccount').val(data.user.userAccount);
                        body.find('#userCreateDate').val(data.user.userCreateDate);
                        body.find('#userEmail').val(data.user.userEmail);
                        body.find('#userIdCard').val(data.user.userIdCard);
                        body.find('#userPhone').val(data.user.userPhone);
                        body.find('#userRemark').val(data.user.userRemark);
                        if (data.user.userSex == 0){
                            body.find('#userSex').val('女');
                        }else {
                            body.find('#userSex').val('男');
                        }
                        if (data.user.userUrl == null ){
                            // 展示默认图片
                        }else {
                            body.find('#userUrl').attr('src', 'http://43.143.176.39/' + data.user.userUrl);
                        }
                        body.find('#consumeMoney').val(data.consumeMoney + '￥');
                        body.find('#learningTime').val(data.learningTime + '分钟');

                    }
                })

            }else if(obj.event == 'bj'){
                layer.open({
                    type:2,
                    title:'修改用户信息',
                    content:'bjUser.html',
                    shade:[1,'#37444B'],
                    anim:4,
                    area:['90%','90%'],
                    //弹出层成功弹出后的回调函数
                    success:function (layero,index){
                        //父页面向子页面传参 -- 向iframe层传数据
                        //获取iframe页面
                        var body = layer.getChildFrame('body',index);

                        body.find('#userId').val(data.user.userId);
                        body.find('#userName').val(data.user.userName);
                        body.find('#userAccount').val(data.user.userAccount);
                        body.find('#userCreateDate').val(data.user.userCreateDate + '  （不可修改）');
                        body.find('#userEmail').val(data.user.userEmail);
                        body.find('#userIdCard').val(data.user.userIdCard);
                        body.find('#userPhone').val(data.user.userPhone);
                        body.find('#userRemark').val(data.user.userRemark);
                        if (data.user.userSex == 0){
                            body.find('#userSex').val('女');
                        }else {
                            body.find('#userSex').val('男');
                        }
                        if (data.user.userUrl == null ){
                            // 展示默认图片
                            body.find('[name = userUrl]').val('../../../../img/a.png');
                        }else {
                            body.find('[name = userUrl]').val(data.user.userUrl);
                            body.find('#userUrl').attr('src', 'http://43.143.176.39/' + data.user.userUrl);
                        }
                        body.find('#consumeMoney').val(data.consumeMoney + '￥  （不可修改）');
                        body.find('#learningTime').val(data.learningTime + '分钟  （不可修改）');

                    }
                })
            }else if (obj.event == 'ft'){
                var sealId = null;
                console.log(data)
                layer.load(6,{time:500})
                //发送ajax
                $.ajax({
                    type:'post',
                    url:'/YltUser/UserManage/getUserSealId',
                    data:{userId:data.user.userId},
                    dataType:'json',
                    success:function (res){
                        console.log(res)
                        sealId = res.data
                        if (res.data == null){
                            layer.open({
                                type:2,
                                title:'封停账号',
                                content:'ftUser.html',
                                shade:[1,'#37444B'],
                                anim:4,
                                area:['60%','60%'],
                                success:function (layero,index){

                                    var body = layer.getChildFrame('body',index);

                                    body.find('#userId').val(data.user.userId);
                                    body.find('#userAccount').val(data.user.userAccount);
                                }
                            })
                        }else {
                            layer.confirm('该用户已被停封，确定要继续停封吗？',function (inx){
                                layer.open({
                                    type:2,
                                    title:'封停账号',
                                    content:'ftUser.html',
                                    shade:[1,'#37444B'],
                                    anim:4,
                                    area:['60%','60%'],
                                    success:function (layero,index){

                                        layer.close(inx)
                                        var body = layer.getChildFrame('body',index);

                                        body.find('#userId').val(data.user.userId);
                                        body.find('#userAccount').val(data.user.userAccount);
                                        body.find('#sealId').val(sealId);
                                    }
                                })
                            })
                        }
                    },
                    errors:function (e){
                        console.log(e)
                        console.log('请求失败')
                    }
                })
            }
        })
    })

}



